﻿<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>

    <script src="@Url.Content("~/Scripts/jquery-1.7.1.js")" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/jquery.min.js")"></script>
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.common.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.metro.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.dataviz.metroblack.min.css")" rel="stylesheet" type="text/css" />

    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/kendo.all.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/kendo.aspnetmvc.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>


    <link href="@Url.Content("~/Content/site.css")" rel="stylesheet" type="text/css" />

    @*<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet">*@

    <style>
        .infoMessage, .successMessage, .warningMessage, .errorMessage, .validationMessage {
            border: 2px solid;
            margin: 10px 0px;
            padding: 15px 10px 15px 50px;
            background-repeat: no-repeat;
            background-position: 10px center;
        }

        .infoMessage {
            color: #205791;
            border-color: #92cae4;
            background-color: #d5edf8;
            background-image: url(images/KnobInfo.png);
        }

            .infoMessage a, .infoMessage a:link, .infoMessage a:visited, .infoMessage a:active {
                color: #205791;
                text-decoration: underline;
            }

        .successMessage {
            color: #264409;
            border-color: #c6d880;
            background-color: #e6efc2;
            background-image: url(images/KnobValidGreen.png);
        }

            .successMessage a, .successMessage a:link, .successMessage a:visited, .successMessage a:active {
                color: #264409;
                text-decoration: underline;
            }

        .warningMessage {
            color: #514721;
            border-color: #ffd324;
            background-color: #FEEFB3;
            background-image: url(images/KnobAttention.png);
        }

            .warningMessage a, .warningMessage a:link, .warningMessage a:visited, .warningMessage a:active {
                color: #514721;
                text-decoration: underline;
            }

        .errorMessage {
            color: #8a1f11;
            border-color: #f4686b;
            background-color: #fbe3e4;
            background-image: url(images/KnobRemoveRed.png);
        }

            .errorMessage a, .errorMessage a:link, .errorMessage a:visited, .errorMessage a:active {
                color: #8a1f11;
                text-decoration: underline;
            }

        .validationMessage {
            color: Red;
            background-image: url(images/KnobCancel.png);
        }

            .validationMessage a, .validationMessage a:link, .validationMessage a:visited, .validationMessage a:active {
                color: red;
                text-decoration: underline;
            }
    </style>

    <style>
         #modal {
    /* These styles MUST be included. Do not change. */
  display:none;
    position: absolute;
    position: fixed;
    top: 0;
    right:-100px;
    height: 100%;
    z-index: 3;
    
    /* Specify the width of your pageslide here */
    /*width: 260px;*/
    padding: 20px;
    
    /* These styles are optional, and describe how the pageslide will look */
    background-color: #333;
    color: #FFF;
    -webkit-box-shadow: inset 0 0 5px 5px #222;
    -moz-shadow: inset 0 0 5px 5px #222;
    box-shadow: inset 0 0 5px 5px #222;
}
    </style>
</head>

<body>

    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title">@Html.ActionLink("your logo here", "Index", "Home")</p>
            </div>
            <div class="float-right">

                @Html.Partial("NavigationalControl", Session["Menu"])

            </div>
        </div>
    </header>
    <div id="content">
        <div id="body">

            <section class="content-wrapper main-content clear-fix">
                @RenderBody()
            </section>
        </div>
    </div>
   
    <footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; @DateTime.Now.Year - My KendoUI ASP.NET MVC Application</p>
            </div>
        </div>
    </footer>

    @(Html.Kendo().Window()
        .Name("windowMessage")
        .Modal(true)
        .Visible(false)
        .Width(300)
        .Draggable()
        .Resizable()
        .Title("Rams's Ten Principles of Good Design")
        .Actions(actions => actions.Refresh().Maximize().Close())
       



)
    @{
        Session.Add("MessageTitle", ""); 
    }
    <script>
        $(document).ready(function () {
            var win = $("#windowMessage").data("kendoWindow");
            win.center();
        });
      
        function ModalCancel() {
            $('#modal').animate({ 'right': -$('#modal').width() }, 300, 'swing', function () { $('#modal').hide(); });
        }
        //$(document).bind('click', function (e) {
        //    if (!$(e.target).is('#modal') && !$(e.target).is('#testMenu li') && $(e.target).closest('#modal').length === 0) {
        //        debugger;
        //        $('#modal').animate({ 'right': -$('#modal').width() }, 300, 'swing', function () { $('#modal').hide(); });
               
        //    }
        //});
    </script>
    <div id="modal"><img src="~/Images/loading-image.gif" /></div>
   
</body>




</html>
